﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>360buy多条件筛选</title>

    <link href="../css/selectInfo.css" rel="stylesheet" />
</head>
<body>
    <div class="filter">
        <dl>
            <dd><div><a>不限</a></div></dd>
            <dd><div><a>党政</a></div></dd>
            <dd><div><a>军队</a></div></dd>
            <dd><div><a>社会</a></div></dd>
            <dd><div><a>金融</a></div></dd>
            <dd><div><a>电信</a></div></dd>
            <dd><div><a>交通</a></div></dd>
            <dd><div><a>能源</a></div></dd>
            <dd><div><a>医疗</a></div></dd>
            <dd><div><a>文化</a></div></dd>
            <dd><div><a>体育</a></div></dd>
            <dd><div><a>教育</a></div></dd>
            <dd><div><a>科研</a></div></dd>
            <dd><div><a>农林</a></div></dd>
            <dd><div><a>水利</a></div></dd>
            <dd><div><a>地产</a></div></dd>
            <dd><div><a>工业</a></div></dd>
            <dd><div><a>商业</a></div></dd>
                        <dd><div><a>服务</a></div></dd>
                        <dd><div><a>其他</a></div></dd>
        </dl>
       <!-- <dl>
            <dt>价格：</dt>
            <dd><div><a>全部</a></div></dd>
            <dd><div><a>1000-2999</a></div></dd>
            <dd><div><a>3000-3499</a></div></dd>
            <dd><div><a>3500-3999</a></div></dd>
            <dd><div><a>4000-4499</a></div></dd>
            <dd><div><a>4500-4999</a></div></dd>
            <dd><div><a>5000-5999</a></div></dd>
            <dd><div><a>6000-6999</a></div></dd>
            <dd><div><a>7000-9999</a></div></dd>
            <dd><div><a>10000以上</a></div></dd>
        </dl>
        <dl>
            <dt>尺寸：</dt>
            <dd><div><a>全部</a></div></dd>
            <dd><div><a>8.9英寸及以下</a></div></dd>
            <dd><div><a>11英寸</a></div></dd>
            <dd><div><a>12英寸</a></div></dd>
            <dd><div><a>13英寸</a></div></dd>
            <dd><div><a>14英寸</a></div></dd>
            <dd><div><a>15英寸</a></div></dd>
            <dd><div><a>16英寸-17英寸</a></div></dd>
        </dl>
        <dl>
            <dt>平台：</dt>
            <dd><div><a>全部</a></div></dd>
            <dd><div><a>AMD Brazos APU平台</a></div></dd>
            <dd><div><a>Intel Sandy Bridge平台</a></div></dd>
            <dd><div><a>Intel平台</a></div></dd>
            <dd><div><a>AMD平台</a></div></dd>
        </dl>
        <dl>
            <dt>显卡：</dt>
            <dd><div><a>全部</a></div></dd>
            <dd><div><a>独立显卡</a></div></dd>
            <dd><div><a>集成显卡</a></div></dd>
            <dd><div><a>核芯显卡</a></div></dd>            
        </dl>-->
    </div>
    <script src="../js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        //选中filter下的所有a标签，为其添加hover方法，该方法有两个参数，分别是鼠标移上和移开所执行的函数。
        $(".filter a").hover(
            function () {
                $(this).addClass("seling");
            },
            function () {
                $(this).removeClass("seling");
            }
        );


        //选中filter下所有的dt标签，并且为dt标签后面的第一个dd标签下的a标签添加样式seled。(感叹jquery的强大)
        $(".filter dt+dd a").attr("class", "seled"); /*注意：这儿应该是设置(attr)样式，而不是添加样式(addClass)，
                                                      不然后面通过$(".filter a[class='seled']")访问不到class样式为seled的a标签。*/

        //为filter下的所有a标签添加单击事件
        $(".filter a").click(function () {
            $(this).parents("dl").children("dd").each(function () {
                $(this).find("a").removeClass("seled");
            });

            $(this).attr("class", "seled");

         //   alert(RetSelecteds()); //返回选中结果
        });
     //   alert(RetSelecteds()); //返回选中结果
    });

    function RetSelecteds() {
        var result = "";
        $(".filter a[class='seled']").each(function () {
            result += $(this).html() + "\n";
        });
        return result;
    }
</script>
</body>
</html>